<template>

    <div id="bg">
        <img src="../assets/images/here.png" alt="" class="here">
        <div class="bgcon">
            <p>1.点击右上角 · · · 按钮</p>
            <p style="position:relative">2.选择浏览器打开 <img src="../assets/images/earth.png" alt="" class="earth"></p>
        </div>
    </div>

</template>

<script>
export default {
    name: "shade"
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

/* 浮层样式 */
 #bg {
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0px;
    left: 0px;

}
 #bg .bgcon {
    font-size: 16px;
    color: #fff;
    position: absolute;
    top: 70px;
    right: 30px;
}
 #bg .here {
    width: 15%;
    position: absolute;
    right: 8px;
    top: 10px;
}
 #bg p {
    height: 30px;
}
 #bg .earth {
    width: 25%;
    position: absolute;
    right: -5px;
    top: -7px;
}
</style>
